<template>
	<view class="goods-detail-params m-20 p-20 radius-20 bg-white">
		<view class="title">
			<text>代理价格</text>
			<text clss="tit">您的等级：{{ props.userAgentGrade.name }}</text>
		</view>
		<view v-if="props.agentProductsList.length > 0">
			<view class="item-box">
				<view class="item">
					<view class="lab">
						<text class="tit">货品名称</text>
					</view>
					<view class="val">
						<text class="tit">销售价</text>
					</view>
					<view class="val">
						<text class="tit">代理价</text>
					</view>
					<view class="val">
						<text class="tit">利润</text>
					</view>
				</view>
				<view class="item" v-for="item, index in props.agentProductsList" :key="index">
					<view class="lab">
						<text class="tit">{{ item.name }}</text>
					</view>
					<view class="val">
						<text class="tit">￥{{ item.productPrice }}</text>
					</view>
					<view class="val">
						<text class="tit">￥{{ item.agentGradePrice }}</text>
					</view>
					<view class="val">
						<text class="tit">￥{{
                            parseFloat(String(item.productPrice - item.agentGradePrice)).toFixed(2)}}</text>
					</view>
				</view>
			</view>
			<view class="tip">
				注：此利润不为最终用户下单后利润，因为订单可能存在优惠。
			</view>
		</view>
		<view v-else class="no-agent">
			该商品暂未录入商品池价格
		</view>
	</view>
</template>

<script setup lang="ts">
	import type { GoodsAgentListType } from "@/core/models";

	const props = withDefaults(defineProps<{
		userAgentGrade : any,
		agentProductsList : Array<GoodsAgentListType>,
	}>(), {
		userAgentGrade: {},
		agentProductsList: () => [],
	});
</script>

<style lang="scss" scoped>
	@import './goods-detail-agent.scss';
</style>